<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0">
        <title>
            Document
        </title>
        <link rel="stylesheet" href="./css/login.css">
        <script src="js/vue.js"></script>
        <script src="js/jquery.1.8.js"></script>
    </head>
    <body>
        <div id="app">
        <div class="out">
            <div class="top">刘博翔vue实训
                <img src="images/aiwrap.png">
            </div>
            <div class="text">
                <input type="text" v-model="loginName" placeholder="输入用户名" />
            </div>
            <div class="text">
                <input type="password" v-model="pwd" placeholder="输入密码" />
            </div>
            <div class="text">
                <input type="text" v-model="name" placeholder="输入姓名" />
            </div>
         
            <div class="bottom" text-align="center" @clink="register">
                注册
            </div>
        </div>
        </div>
    </body>

    <script>
        var vm=new Vue({
            el:'#app',
            data:{
                loginName:'',
                pwd:'',
                name:'',
            },
            methods:{
                register(){
                    $.ajaxSetup({
                        contentType:"application/json;charset=utf-8"
                    });
                    var data ={'loginName':this.loginName,'pwd':this.pwd,'name':this.name}

                    $.post("http://api.tutestudio.net/api.res",JSON.stringify(data),function(res){
                    if(res.code==200){
                        alert('注册成功')
                        location.href="login.html"
                    }
                    else{
                        alert("注册失败")
                    }
                    })
                }
            }
        })
    </script>
</html>